// 获取所有元素ID
var carousel = document.getElementById("car");
var carousel_image_container = document.getElementById("car_image_container");
var carousel_li_container = document.getElementById("car_li_container");
var carousel_controller = document.getElementById("car_controller");
var carousel_controller_left = document.getElementById("car_controller_left");
var carousel_controller_right = document.getElementById("car_controller_right");
var picIndex = 0;
for(var i = 0; i < carousel_li_container.children.length; i++) {
	carousel_li_container.children[i].setAttribute("index", i);
	carousel_li_container.children[i].onmouseover = function() {
		for(var j = 0; j < carousel_li_container.children.length; j++) {
			carousel_li_container.children[j].removeAttribute("class");
		}
		this.className = "active";
		picIndex = this.getAttribute("index");
		for(var j = 0; j < carousel_image_container.children.length; j++) {
			carousel_image_container.children[j].style.display = "none";
		}
		carousel_image_container.children[picIndex].style.display = "block";
	};
}
carousel_li_container.children[0].className = "active";
carousel_image_container.children[0].style.display = "block";
function Event() {
	picIndex++;
	if(picIndex == carousel_image_container.children.length) {
		picIndex = 0;
	}
	for(var j = 0; j < carousel_image_container.children.length; j++) {
		carousel_image_container.children[j].style.display = "none";
	}
	carousel_image_container.children[picIndex].style.display = "block";
	if(picIndex == carousel_image_container.children.length) {
		carousel_li_container.children[carousel_li_container.children.length].removeAttribute("class");
		carousel_li_container.children[0].className = "active";
	} else {
		for(var i = 0; i < carousel_li_container.children.length; i++) {
			carousel_li_container.children[i].removeAttribute("class");
		}
		carousel_li_container.children[picIndex].className = "active";
	}
}
carousel_controller_right.onclick = Event;
carousel_controller_left.onclick = function() {
	picIndex--;
	if(picIndex == -1) {
		picIndex = carousel_image_container.children.length - 1;
	}
	for(var j = 0; j < carousel_image_container.children.length; j++) {
		carousel_image_container.children[j].style.display = "none";
	}
	carousel_image_container.children[picIndex].style.display = "block";
	for(var i = 0; i < carousel_li_container.children.length; i++) {
		carousel_li_container.children[i].removeAttribute("class");
	}
	carousel_li_container.children[picIndex].className = "active";
};
var timeId = setInterval(function() {
	Event();
}, 2000);
carousel.onmouseover = function() {
	clearInterval(timeId);
};
carousel.onmouseout = function() {
	timeId = setInterval(Event, 2000);
};